<template>
  <div>
    <toptip ref="topTip">
      <div class="tip">{{txt}}</div>
    </toptip>
    <div class="declaration">
      <div class="title">签约电子声明须知</div>
      <div class="txt">
        <p>1.同意签约电子声明的用户,即可查询处罚信息.</p>
        <p>2.不同意签约电子声明者需在3个工作日后才生成处罚决定书.</p>
        <p>3.如有异议的用户请到窗口陈述,申辩，申请听证.</p>
      </div>
      <div class="btnCon">
        <button class="agreen" @click="confirmBtn">同意</button>
        <button class="agreen" @click="cancelBtn">不同意</button>
      </div>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  import {baseurl} from '../base/config'
  import {mapGetters} from "vuex"
  import toptip from './top-tip/top-tip'
  import http from '../util/https'

  export default {
    name: "declaration",
    data() {
      return {
        txt: "",
        id: this.$route.params.id,
        status: {
          fail: 1,
          success: 0
        },
      }
    },
    components: {
      toptip
    },
    created() {
      console.log(this.setuser)
    },
    mounted() {
      //  console.log(this.id);
      console.log(this.setuser)
    },
    computed: {
      ...mapGetters([
        'setuser'
      ])
    },
    methods: {
      //不同意
      cancelBtn() {
        this.txt = "请3个工作日后来查询相关处罚决定书!";
        this.$refs.topTip.show();
        this.checksign(this.status.fail)
      },
      //同意
      confirmBtn() {
        this.checksign(this.status.success);
        this.$router.push({
            name: "draw"
          }
        )
      },
      //签约电子声明
      checksign: async function (status) {
        const url = baseurl + "/agreement/statement/decideDissent.json";
        let params = {
          detailListId: this.id ? this.id : this.setuser.detailList.id,
          status
        };
      //  console.log(params)
        const res = await http.post(url, params);
       // console.log(res);
      },
    }
  }
</script>

<style scoped type="text/less" lang="less">
  .tip {
    font-size: .35rem;
    background: #449d44;
    width: 100%;
    height: .8rem;
    text-align: center;
    color: #fff;
    line-height: .8rem;

  }

  .declaration {
    font-size: .35rem;
    padding: 0 .5rem;
    .txt {
      font-size: .28rem;
      line-height: .5rem;
    }
    .btnCon {
      text-align: center;
      margin-top: 1rem;
      .agreen {
        width: 2rem;
        height: .8rem;
        background: #449d44;
        outline: none;
        border: none;
        margin-right: .5rem;
        color: #fff;
        border-radius: .2rem;

      }

    }
    .title {
      padding: 1rem 0 .5rem;
      font-size: .4rem;
      text-align: center;
      color: #449d44;

    }
  }

</style>
